import React, { Component } from 'react'
import { Form, Input, Button } from 'antd';
import './login.less'
import { loginRequest } from '../../../api/user';

interface IProps {
    changeLoginStatus(isLogin: boolean): void
}
export default class Login extends Component<IProps> {

    onFinish = async (values: any) => {
        const res = await loginRequest(values.name, values.password);    //登陆请求
        //向上更新状态 是否登录成功
        if (res) {
            this.props.changeLoginStatus(!!res);
        }
    }
    render() {
        return (
            <div className="loginBox">
                <Form
                    layout="vertical"
                    name="login"
                    initialValues={{ remember: true }}
                    onFinish={this.onFinish}
                >
                    <Form.Item
                        label="用户名"
                        name="name"
                        rules={[{ required: true, message: '用户名必填' }]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="密码"
                        name="password"
                        rules={[{ required: true, message: '请输入密码' }]}
                    >
                        <Input.Password />
                    </Form.Item>

                    <Form.Item>
                        <Button type="primary" htmlType="submit">
                            登录
                        </Button>
                    </Form.Item>
                </Form>
            </div>
        )
    }
}
